AULA03 - Expressões e operadores¶

AGENDA¶

  • Expressoões com símbolo de adição
  • Conversão de Tipos
  • Escape Sequence
  • Operadores aritméticos
  • Operadores relacionais
  • Operadores lógicos
  • Comparações não booleanas
  • Operadores de atribuição
  • Biblioteca Math
  • Referências
  • Perguntas

1. Expressões que utilizam o símbolo de adição¶

  • O Javascript por ser uma linguagem dinamicamente tipada, não precisamos especificar o tipo de dado.

  • Os tipos de dados serão convertidos conforme a execução.

  • Podemos concatenar Strings por meio do uso do símbolo de adição.

  • Em expressões envolvendo valores numéricos e strings com o operador +, a linguagem JavaScript converte valores numéricos para strings. 
x = "A resposta é "+ 42;
y = 42 + " é a resposta.";
console.log(x);
console.log(y);
Fonte: Autoria própria
  • Nas declarações envolvendo outras operações, não é feita a conversão. 
k = "88"- 30;
j = 56 * "2";
console.log(k);
console.log(j);
Fonte: Autoria própria

2. Conversão de Tipos Number, String, Boolean¶

  • De acordo com [Javascript.info] as três conversões de tipo mais usadas são string, number e boolean.

2.1. Conversão String(valor)¶

  • Ocorre quando produzimos algo. A conversão para string geralmente é óbvia para valores primitivos.
    • Sintaxe: String(valor).
x = 10;
String(x);
Fonte: Autoria própria

2.2. Conversão Number(valor)¶

  • Ocorre em operações matemáticas.
    • Sintaxe: Number(valor).
    • A conversão segue as regras:
Valor É convertido em
undefined NaN
null 0
true / false 1 / 0
string A string é lida "como está", os espaços em branco de ambos os lados são ignorados.
Uma cadeia vazia se torna 0. Um erro dá NaN.
Fonte: Autoria própria
  • Observações:
    • Number(object) tenta converter a string inteira em um número (que também pode ser um float).
    • Quando usamos parseInt(valor) ou parseFloat(valor), é feito uma análise do primeiro dígito e retorna o valor que foi analisado. 
Number('123num');
NaN

parseInt('123num');
123
Fonte: Autoria própria

2.3. Conversão Boolean(valor)¶

  • Ocorre em operações lógicas.
    • Sintaxe: Boolean(valor).
    • Segue as regras:
Valor É convertido em
0, null, undefined, NaN," " false
qualquer outro valor true
Fonte: Autoria própria Fonte: Autoria própria
  • Observações:
    • A maioria dessas regras é fácil de entender e memorizar.
    • As exceções notáveis em que as pessoas geralmente cometem erros são:
      • undefined é NaN como um número, não 0.
      • "0" e strings apenas de espaço como " " são verdadeiras como booleanas.

2.4. Conversão com parseInt(valor) ou parseFloat(valor)¶

  • A linguagem Javascript ainda aceita a conversão utilizando parse, porém conforme já explicado anteriormente, ao utilizar parse, é feita uma análise somente no primeiro dígito e não no conteúdo inteiro.

2.4.1. Conversão com parseInt(valor)¶

  • Float para Inteiro:

    • Para convertermos um tipo de dado float para inteiro, utilizamos parseInt(valor). Perdemos precisão.

  • String para Inteiro:

    • Para convertermos um tipo de dado string para inteiro, utilizamos parseInt(valor).
Fonte: Autoria própria

2.4.2. Conversão com parseFloat(valor)¶

  • Inteiro para Float:
    • Para convertermos um tipo de dado inteiro para float, utilizamos parseFloat(valor).
Fonte: Autoria própria

2.6. Escape Sequence¶

Escape Sequence Significado Exemplo Saída
\\ Exibe uma barra invertida. console.log("Ana \ Paula")
\' Exibe uma aspas simples. console.log("Ana \' Paula")
\" Exibe uma aspas duplas. console.log("Ana \" Paula")
\n Insere uma quebra de linha. console.log("Ana \n Paula")
\u Insere um caracter unicode. Deve ser acompanhado com 4 números. console.log("Isto é um sol: \u2600 .")
\t Insere uma tabulação. console.log("Ana \t Paula")

2.7. Entrada de Dados¶

  • Para aprofundar sobre o assunto, consulte MDN Mozilla.

2.7.1. Instrução prompt(texto)¶

  • Uma das formas de entrar com os dados, é via prompt do navegador. Outra, via formulário.
    • prompt(): Exibe uma informação solicitando a ação do usuário com um espaço para digitar e dois botões ok, cancelar (ou Esc). 
/* no console digite */
prompt("Indique sua idade: ");
Fonte: Autoria própria

2.7.2. Instrução alert(texto)¶

  • Exibir mensagens no navegador, ou perguntar e aguardar uma ação:
    • alert(): Exibe a informação indicada entre parênteses com um botão de ok. 
/* no console digite */
alert("Seja bem vindo!');
Fonte: Autoria própria

2.7.2. Instrução confirm(texto)¶

  • Exibir mensagens no navegador, ou perguntar e aguardar uma ação:
    • confirm(): Exibe a informação indicada entre parênteses com dois botões: ok, cancelar (ou Esc). Se escolher ok, o retorno é true, caso contrário é, false. 
/* no console digite */            
confirm("Você gosta de estudar?");
Fonte: Autoria própria

Lembrando que o retorno da entrada é do tipo String. Caso seja necessário efetuar algum cálculo, necessário converter o tipo.¶

2.8. Atribuição¶

  • A atribuição é feita por meio do uso do símbolo =.
  • Em javascript é possível efetuar a tribuição encadeada, por exemplo, de acordo com [Javascript.info]:
    • As atribuições encadeadas são avaliadas da direita para a esquerda.
    • Em primeiro lugar, a expressão mais à direita 2 + 2 é avaliado e então atribuído às variáveis da esquerda: c, b e a.
    • No final, todas as variáveis compartilham um único valor. 
let a, b, c;

a = b = c = 2 + 2;

2.9. Operadores Aritméticos¶

Símbolo Significado Descrição Exemplo Saída
++ incremento Adiciona um ao operando.
Se usado como operador prefixado (++x), retorna o valor de seu operando após a adição.
Se usado como operador pósfixado (x++), retorna o valor de seu operando antes da adição.		 Se x é 3, então ++x, tanto ++x e x serão 4.
E x++, x++ será 3, e x será 4.
-- decremento Subtrai um de seu operando. O valor de retorno é análogo àquele do operador de incremento. Se x é 3, então --x, tanto --x e x serão 2.
E x--, x-- será 3, e x será 2.
-

+		 subtração

adição		 Retorna a negação de seu operando, ou o resultado do valor subtraído.

Tenta converter o operando em um número, sempre que possível.		 Se x é 3, então -x é -3.
E retorna x, 3.

Se +x = "3", retorna 3.
Se +x = true, retorna 1.
%

**		 divisão (resto ou módulo)

exponenciação		 Retorna o inteiro restante da divsão dos dois operandos.

Calcula a base elevada à potência do expoente.		 Se x = 12, y = 5, então retorno será 2.

Se x = 2, y = 3, então x elevado a y, retorna 8.
Se x = 10, y = -1, então retorna 0.1.
Se x = 9, y = 1/2, então retorna a raiz de x.

2.10. Operadores Relacionais¶

  • Um operador relacional compara seus operandos e sempre retorna um valor booleano baseado em se a comparação é verdadeira:
    • Caso seja verdadeira, True ou 1.
    • Caso seja falso, False ou 0.
Símbolo Significado Exemplo
Considerando: a = 10 e b = 15.		 Saída
< menor. a < b true
<= menor ou igual a. a <= b true
> maior. a > b false
>= maior ou igual a. a >= b false
== igual. a == b false
!= não igual (diferente). a != b true
!== estritamente não igual. Retorna verdadeiro caso os operandos não sejam iguais e/ou não sejam do mesmo tipo. a !== b true
=== estritamente igual. Retorna verdadeiro caso os operandos sejam iguais e do mesmo tipo. a === b false
Fonte: Autoria própria

2.11. Operadores Lógicos¶

  • O valor lógico é um tipo de dado binário: verdadeiro (True), ou falso (False).
and && True False
True True False
False False False
or True False
True True True
False True False
  • O or é representado por dois pipe seguidos.
not !
! True False
! False True 
let nome = 'Ana Paula';
let maiorIdade = true;
let habilitada = false;
let dirigirOk = maiorIdade && habilitada;
let naoPode = !dirigirOk;

console.log('Dirigir: ', dirigirOk);
console.log('Não dirigir: ', naoPode);
Fonte: Autoria própria

2.12. Comparações não booleanas¶

  • Comparações lógicas com valores não booleanos. Para saber mais MDN Web Docs - Truthy ou MDN Web Docs - Falsy.
  • No Javascript temos o conceito de Truthy e Falsy.
  • Nem sempre as comparações lógicas retornarão um booleano.

  • O que é um valor Falsy: Um valor falsy é um valor que se traduz em falso quando avaliado em um contexto Boolean.

  • Truthy: Se não for identificado como falsy, ele será truthy.

  • Valores Falsy:

    • false
    • null
    • undefined
    • 0
    • NaN
    • ' '
// Contexto booleano 
false || true        // Saída: true
false || 'Ana'       // Saída: 'Ana'
false || 1.          // Saída: 1

// Os operadores lógicos or, efetuam a primeira comparação e se já encontrarem um valor truthy, eles ignoram as seguintes.
false || 1 || 3      // Saída: 1

2.13. Operadores de Atribuição¶

2.13.1. Operadores de Atribuição Compostos¶

Símbolo Significado Exemplo
Considerando x, y, w, z, k, a iguais a 9.		 Saída
x +=1 x = x + 1 10
y -=1 y = y - 1 8
w *=1 w = w * 1 9
z /=1 z = z / 1 9.0
k %=1 k = k % 1 0
a ** = 2 a = a ** 2 81
Fonte: Autoria própria

2.13.2. Exponenciação ou potência¶

  • Exponenciação ou potência:
    • Potenciação é a operação matemática que eleva um número a uma determinada potência.

2.13.3. Exponenciação ou potência¶

  • Radiciação:
    • A radiciação é o inverso da potenciação.
    • Podemos obter a radiciação utilizando as propriedades matemáticas.

  • Todo número elevado ao seu inverso é a sua raiz, logo:

    • N elevado a (1/2), obtemos a raiz quadrada de N. Elevado a (1/3), raiz cúbica.

  • Observação:

    • Para saber mais sobre outros operadores, consulte Javascript.info.

2.14. Biblioteca Math e métodos¶

  • Para aprofundamento, consulte MDN Mozilla Math.

Math.pow(base, expoente)¶

  • A função Math.pow(base, expoente) retorna a base elevada ao expoente.
Math.pow(2,3);      // potência de 2 elevado a 3.
Math.pow(81,1/2);   // potência de 81 elavado a 1/2, logo, extraindo raiz quadrada de 81.
Math.pow(8,1/3);    // potência de 8 elavado a 1/3, logo, extraindo raiz cúbica de 8.
Fonte: Autoria própria Fonte: Autoria própria Fonte: Autoria própria

Math.sqrt(valor)¶

  • A função Math.sqrt() retorna a raiz quadrada de um número raiz(valor).
Math.sqrt(81);
Fonte: Autoria própria

Math.round(valor)¶

  • A função Math.round(valor) retorna o valor de um número arredondado para o inteiro mais próximo.
Math.round(8.956834);
Fonte: Autoria própria

Math.ceil(valor)¶

  • A função Math.ceil(valor) retorna o menor número inteiro maior ou igual a "valor".
Math.ceil(78.4567);
Fonte: Autoria própria

Math.floor(valor)¶

  • A função Math.floor(valor) retorna o menor número inteiro dentre o número "valor".
Math.floor(78.4567);
Fonte: Autoria própria

Math.trunc(valor)¶

  • O método Math.trunc() retorna a parte inteira de um número, descartando suas casas decimais.
Math.trunc(345.983);
Fonte: Autoria própria

Math.abs(valor)¶

  • A função Math.abs(valor) retorna o valor absoluto de um número "valor",
Math.abs(-459);
Fonte: Autoria própria

Math.min(valor1, valor2, ...)¶

  • A função Math.min() retorna o menor valor passado como parâmetro, ou NaN se o parâmetro não é ou não pode ser convertido para um número.
Math.min(10, 4, 89, -9);
Fonte: Autoria própria

Math.max(valor1, valor2, ...)¶

  • A função Math.max() retorna o maior de um ou mais números.
Math.max(10, 4, 89, -9);
Fonte: Autoria própria

Math.random(valor)¶

  • A função Math.random() retorna um número pseudo-aleatório no intervalo [0, 1], ou seja, de 0 (inclusivo) até, mas não incluindo, 1 (exclusivo). Por exemplo, para sortearmos um número entre 0 e 20, basta multiplicar por 20 e combinar com a função Math.floor().
Math.floor(Math.random(0, 1)*20);                   // números aleatórios entre 0 e 20 (exclusivo)

Math.floor(Math.random() * (max - min + 1) + min);  // números aleatórios com definição de intervalos, inclusive o max.


// ou criando uma função
function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

// executando a função
getRandomInt(10, 40);
Fonte: Autoria própria Fonte: Autoria própria Fonte: Autoria própria

Math.sin(valor)¶

  • A função Math.sin() retorna o seno de um número.

  • Para calcularmos os valores de uma ângulo, precisamos convertê-los para radianos antes de efetuar os cálculos.

    • Radiano: é o nome dado à medida do arco de uma circunferência de raio r, quando tal arco também mede r, e pode ser relacionado ao ângulo central desse arco.
  • Para efetuar a conversão multiplique o ângulo pelo valor de PI (3.141592653589793) e divida por 180 (Math.PI/180).
Math.sin(90*Math.PI/180);
Fonte: Autoria própria

Referências¶

  • Esta aula foi elaborada a partir do conteúdo disponibilizado em cada um dos links indicados no próprio texto.
  • Javascript.info.

ADS - HTML5, CSS3, JS.
Modelo e formato elaborado pela profa. Ana Paula Müller Giancoli - BSD 2-Clause License. - Julho.2022.

</div> </div>